{% extends 'site.html' %}
{% block content %}
    <style>
        tr, th {
            text-align: center;
            vertical-align: middle;
        !important;
        }
    </style>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-6 col-md-offset-2"><h2>BBS</h2></div>
            <div class="col-md-2 col-md-offset-2">
                <h4><a href="{% url 'blog:site' request.user.username %}">{{ request.user.username }}</a></h4>
            </div>
        </div>
        <br>
        <div class="row">
            <div class="col-md-2">
                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                    <div class="panel panel-primary">
                        <div class="panel-heading" role="tab" id="headingOne">
                            <h4 class="panel-title">
                                <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"
                                   aria-expanded="true" aria-controls="collapseOne">
                                    随笔管理
                                </a>
                            </h4>
                        </div>
                        <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel"
                             aria-labelledby="headingOne">
                            <div class="panel-body" style="line-height: 35px">
                                <p><a href="{% url 'article:add' request.user.username %}">新建随笔</a></p>
                                <p><a href="#article" id="home-tab" role="tab"
                                      data-toggle="tab"
                                      aria-controls="home" aria-expanded="true"
                                      onclick="window.location.href={% url 'backend:backend' %}">管理随笔</a>
                                </p>
                                <p><a href="{% url 'backend:recycle' %}">回收站</a></p>
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-info">
                        <div class="panel-heading" role="tab" id="headingTwo">
                            <h4 class="panel-title">
                                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion"
                                   href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                    分类管理
                                </a>
                            </h4>
                        </div>
                        <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel"
                             aria-labelledby="headingTwo">
                            <div class="panel-body" style="line-height: 35px">
                                <p><a href="{% url 'backend:addCategoryTag' 'category' %}">新建分类</a></p>
                                <p><a href="{% url 'backend:manage' 'category' %}">管理分类</a></p>
                            </div>
                            <div class="panel panel-success">
                                <div class="panel-heading">
                                    <h3 class="panel-title">分类展示</h3>
                                </div>
                                <div class="panel-body">
                                    {% for category in category_all %}
                                        <p>
                                            <a href="{% url 'blog:select_article' request.user.username 'category' category.pk %}">{{ category.name }}</a>
                                        </p>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-info">
                        <div class="panel-heading" role="tab" id="headingThree">
                            <h4 class="panel-title">
                                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion"
                                   href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                    标签管理
                                </a>
                            </h4>
                        </div>
                        <div id="collapseThree" class="panel-collapse collapse" role="tabpanel"
                             aria-labelledby="headingThree">
                            <div class="panel-body" style="line-height: 35px">
                                <p><a href="{% url 'backend:addCategoryTag' 'tag' %}">新建标签</a></p>
                                <p><a href="{% url 'backend:manage' 'tag' %}">管理标签</a></p>
                            </div>
                            <div class="panel panel-success">
                                <div class="panel-heading">
                                    <h3 class="panel-title">标签展示</h3>
                                </div>
                                <div class="panel-body">
                                    {% for tags in tags_all %}
                                        <p>
                                            <a href="{% url 'blog:select_article' request.user.username 'tag' tags.pk %}">{{ tags.name }}</a>
                                        </p>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                    {% if request.user.is_superuser %}
                        <div class="panel panel-warning">
                            <div class="panel-heading" role="tab" id="headingFour">
                                <h4 class="panel-title">
                                    <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion"
                                       href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
                                        广告管理
                                    </a>
                                </h4>
                            </div>
                            <div id="collapseFour" class="panel-collapse collapse" role="tabpanel"
                                 aria-labelledby="headingFour">
                                <div class="panel-body" style="line-height: 35px">
                                    <p><a href="{% url 'backend:add_adv' %}">新建广告</a></p>
                                    <p><a href="{% url 'backend:manage' 'advertisement' %}">管理广告</a></p>
                                </div>
                            </div>
                        </div>
                    {% endif %}
                </div>
            </div>
            <div class="col-md-10">
                {% block backend_main %}
                    <div class="bs-example bs-example-tabs" data-example-id="togglable-tabs">
                        <ul id="myTabs" class="nav nav-tabs" role="tablist">
                            <!-- Togglable tabs 标签 -->
                            <li role="presentation" class="active"><a href="#article" id="home-tab" role="tab"
                                                                      data-toggle="tab"
                                                                      aria-controls="home" aria-expanded="true">随笔</a>
                            </li> <!-- 随笔 -->
                            <li role="presentation" class=""><a href="#category" role="tab" id="profile-tab"
                                                                data-toggle="tab"
                                                                aria-controls="profile" aria-expanded="false">分类</a>
                            </li>  <!-- 分类 -->
                            <li role="presentation" class=""><a href="#tags" role="tab" id="profile-tab"
                                                                data-toggle="tab"
                                                                aria-controls="profile" aria-expanded="false">标签</a>
                            </li><!-- 标签 -->
                            <li role="presentation" class=""><a href="#comments" role="tab" id="profile-tab"
                                                                data-toggle="tab"
                                                                aria-controls="profile" aria-expanded="false">评论</a>
                            </li><!-- 评论 -->
                        </ul>
                        <div id="myTabContent" class="tab-content"> <!-- Togglable tabs 标签对应的块 -->
                            <div role="tabpanel" class="tab-pane fade active in" id="article"
                                 aria-labelledby="home-tab">
                                <div class="panel panel-default">
                                    <table class="table table-hover">
                                        <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>标题</th>
                                            <th>发布时间</th>
                                            <th>点赞数</th>
                                            <th>点踩数</th>
                                            <th>评论数</th>
                                            <th>操作</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for article in article_all %}
                                            <tr>
                                                <th scope="row">{{ forloop.counter }}</th>
                                                <td>
                                                    <a href="{% url 'article:detail' request.user.username article.pk %}">{{ article.title|truncatechars:20 }}...</a>
                                                </td>
                                                <td>{{ article.create_time|date:'Y-m-d H:i:s' }}</td>
                                                <td>{{ article.up_count }}</td>
                                                <td>{{ article.down_count }}</td>
                                                <td>{{ article.comment_count }}</td>
                                                <td>
                                                    <button class="btn btn-warning"><a
                                                            href="{% url 'article:edit' request.user.username article.pk %}">编辑</a>
                                                    </button>
                                                </td>
                                                <td>
                                                    <button class="btn btn-danger"><a
                                                            href="{% url 'article:del' request.user.username article.pk %}">删除</a>
                                                    </button>
                                                </td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                                <div class="text-center">{{ page_html|safe }}</div>
                            </div>  <!-- 随笔 -->
                            <div role="tabpanel" class="tab-pane fade" id="category" aria-labelledby="profile-tab">
                                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                                    {% for category in category_all %}
                                        <div class="panel panel-info">
                                            <div class="panel-heading" role="tab" id="heading{{ category.pk }}">
                                                <h5 class="panel-title">
                                                    <a role="button" data-toggle="collapse" data-parent="#accordion"
                                                       href="#category_{{ category.pk }}"
                                                       aria-expanded="true" aria-controls="category_{{ category.pk }}">
                                                        {{ category.name }}
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="category_{{ category.pk }}" class="panel-collapse collapse in"
                                                 role="tabpanel"
                                                 aria-labelledby="heading{{ category.pk }}">
                                                <div class="panel-body" style="line-height: 35px">
                                                    <table class="table table-hover">
                                                        <thead>
                                                        <tr>
                                                            <th>序号</th>
                                                            <th>文章标题</th>
                                                            <th>发布时间</th>
                                                            <th>点赞数</th>
                                                            <th>点踩数</th>
                                                            <th>评论数</th>
                                                            <th>是否已删除</th>
                                                            <th>操作</th>
                                                            <th>操作</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody>
                                                        {% for article in category.article_set.all %}
                                                            <tr>
                                                                <th scope="row">{{ forloop.counter }}</th>
                                                                <td>
                                                                    <a href="{% url 'article:detail' request.user.username article.pk %}">{{ article.title|truncatechars:20 }}...</a>
                                                                </td>
                                                                <td>{{ article.create_time|date:'Y-m-d H:i:s' }}</td>
                                                                <td>{{ article.up_count }}</td>
                                                                <td>{{ article.down_count }}</td>
                                                                <td>{{ article.comment_count }}</td>
                                                                <td>{{ article.is_delete }}</td>
                                                                <td>
                                                                    <button class="btn btn-warning"><a
                                                                            href="{% url 'article:edit' request.user.username article.pk %}">编辑</a>
                                                                    </button>
                                                                </td>
                                                                <td>
                                                                    <button class="btn btn-danger"><a
                                                                            href="{% url 'article:del' request.user.username article.pk %}">删除</a>
                                                                    </button>
                                                                </td>
                                                            </tr>
                                                        {% endfor %}
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div><!-- 分类 -->
                            <div role="tabpanel" class="tab-pane fade" id="tags" aria-labelledby="profile-tab">
                                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                                    {% for tags in tags_all %}
                                        <div class="panel panel-info">
                                            <div class="panel-heading" role="tab" id="headingTag{{ tags.pk }}">
                                                <h5 class="panel-title">
                                                    <a role="button" data-toggle="collapse" data-parent="#accordion"
                                                       href="#tag_{{ tags.pk }}"
                                                       aria-expanded="true" aria-controls="tag_{{ tags.pk }}">
                                                        {{ tags.name }}
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="tag_{{ tags.pk }}" class="panel-collapse collapse in"
                                                 role="tabpanel"
                                                 aria-labelledby="headingTag{{ tags.pk }}">
                                                <div class="panel-body" style="line-height: 35px">
                                                    <table class="table table-hover">
                                                        <thead>
                                                        <tr>
                                                            <th>序号</th>
                                                            <th>文章标题</th>
                                                            <th>发布时间</th>
                                                            <th>点赞数</th>
                                                            <th>点踩数</th>
                                                            <th>评论数</th>
                                                            <th>是否已删除</th>
                                                            <th>操作</th>
                                                            <th>操作</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody>
                                                        {% for article in tags.article_set.all %}
                                                            <tr>
                                                                <th scope="row">{{ forloop.counter }}</th>
                                                                <td>
                                                                    <a href="{% url 'article:detail' request.user.username article.pk %}">{{ article.title|truncatechars:20 }}...</a>
                                                                </td>
                                                                <td>{{ article.create_time|date:'Y-m-d H:i:s' }}</td>
                                                                <td>{{ article.up_count }}</td>
                                                                <td>{{ article.down_count }}</td>
                                                                <td>{{ article.comment_count }}</td>
                                                                <td>{{ article.is_delete }}</td>
                                                                <td>
                                                                    <button class="btn btn-warning"><a
                                                                            href="{% url 'article:edit' request.user.username article.pk %}">编辑</a>
                                                                    </button>
                                                                </td>
                                                                <td>
                                                                    <button class="btn btn-danger"><a
                                                                            href="{% url 'article:del' request.user.username article.pk %}">删除</a>
                                                                    </button>
                                                                </td>
                                                            </tr>
                                                        {% endfor %}
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div><!-- 标签 -->
                            <div role="tabpanel" class="tab-pane fade" id="comments" aria-labelledby="profile-tab">
                                <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                                    <table class="table table-hover">
                                        <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>评论文章</th>
                                            <th>评论内容</th>
                                            <th>发布时间</th>
                                            <th>操作</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for comment in comment_all %}
                                            <tr>
                                                <th scope="row">{{ forloop.counter }}</th>
                                                <td>
                                                    <a href="{% url 'article:detail' request.user.username comment.article.pk %}">{{ comment.article|truncatechars:20 }}...</a>
                                                </td>
                                                <td>{{ comment.content }}</td>
                                                <td>{{ comment.create_time|date:'Y-m-d H:i:s' }}</td>
                                                <td>
                                                    <button class="btn btn-warning"><a
                                                            href="">编辑</a></button>
                                                </td>
                                                <td>
                                                    <button class="btn btn-danger"><a
                                                            href="{% url 'backend:delete' 'comment' comment.pk %}">删除</a>
                                                    </button>
                                                </td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                            </div><!-- 评论 -->
                        </div>
                    </div>
                {% endblock %}
            </div>
        </div>
    </div>
{% endblock %}